<template>

  <div class="components-input-demo-presuffix">
    <br>
    <a-input ref="userNameInput" v-model="username" placeholder="请输入要查询的用户名"></a-input>
    <br />
    <br />
    <a-button type="dashed" @click="find">查找</a-button>

    <br />
    <br />
    <table border="1px" cellspacing="0">
      <tr>
        <th>ID</th>
        <th>用户名</th>
        <th>等级</th>
      </tr>
      <tr v-for="i in ShowUserList" :key="i.id">
        <td>{{i.id}}</td>
        <td>{{i.username}}</td>
        <td>{{i.user_level}}</td>
      </tr>
    </table>

<!--    <p v-for="i in ShowUserList" :key="i.id">-->
<!--      <span>{{i.id}}</span>-->
<!--      <span>{{i.username}}</span>-->
<!--      <span>{{i.password}}</span>-->
<!--    </p>-->
  </div>

</template>

<script>
export default {
name: "find_user",
  data(){
  return{
    username: '',
    ShowUserList:[],
  }
  },
  methods:{
    find() {
      this.$axios.get('/z/showuser/?username='+this.username)
      .then(res=>{
        this.ShowUserList=res.data
        alert("查询成功")
        console.log(res.data)
      })
    },
  }
}
</script>

<style scoped>

</style>
